<template>
	<view class="page flex-col">
		<view class="group_1 flex-col">
			<view class="section_1 flex-col">
				<view class="section_3 flex-row" v-for="(item,index) in list" :key="index" @click="venuelist(item)">
					<image class="image_3" referrerpolicy="no-referrer" :src="item.venue_thumb" />
					<view class="tag_1 flex-col" v-if="item.id == id">
						<text class="text_1">当前场馆</text>
					</view>

					<view class="section_4 flex-col">
						<text class="text_6">{{item.venue_name}}</text>
						<view class="" style="display:flex;
							flex-direction: row;margin-top: 25rpx;">
							<view class="tag_3 flex-col" v-for="(im,inx) in item.marks" :key="inx">
								<text class="text_7">{{im.name}}</text>
							</view>
							
						</view>
						<text class="text_8">{{item.address}}</text>
					</view>
					<text class="text_9">{{item.distance}}</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	const venues = require("@/api/venues/venues.js");
	export default {
		data() {
			return {
				constants: {},
				list: [],
				id: '',
				coordinates: {}, //经纬度
			};
		},
		onLoad(options) {
			console.log(options, '444')
			this.getLocation()
			this.getVenues()
			this.id = uni.getStorageSync('venues_id')
		},
		methods: {
			// 场馆首页排序
			async getVenues() {
				let params = {
					project_id: getApp().globalData.projectId,
					app_id: this.$https.weixinAppId,
					venue_id: uni.getStorageSync('venues_id'),
					lat: this.coordinates.lat,
					lng: this.coordinates.lng,
				}
				let res = await venues.getVenues(params)
				if (res.code === 1) {
					console.log(res, '123456')
					this.list = res.data.result
				}
			},

			async getLocation() {
				const [err, res] = await uni.getLocation({
					isHighAccuracy: true, // 开启地图精准定位
					type: "gcj02",
				});
				let latlng = {};
				if (!err) {
					latlng = {
						lat: res.latitude,
						lng: res.longitude,
					};
				}
				this.coordinates = latlng;
			},
			async venuelist(item) {
				console.log(item.id, '9999')
				uni.removeStorage({
					key: 'venues_id',
					success: function(res) {}
				});
				uni.setStorageSync('venues_id', item.id)
				let params = {
					open_id: uni.getStorageSync('openid'),
					venue_id:uni.getStorageSync('venues_id')
				}
				let res = await venues.setLastLoginVenue(params)
				if (res.code === 1) {
					console.log(res, '123456')
				}
				
				uni.reLaunch({
					url: '/pages/index/index'
				})
				console.log(uni.getStorageSync('venues_id'), '1456')

			}
		},
	};
</script>
<style lang="scss" scoped>
	@import '../../static/css/common/common.scss';

	.page {
		position: relative;
		width: 750rpx;
		/* height: 1624rpx; */
		height: 100%;
		overflow: hidden;

		.group_1 {
			width: 750rpx;
			height: 100%;

			.section_1 {
				width: 750rpx;
				height: 100%;
				margin-bottom: 1rpx;

				.section_3 {
					width: 689rpx;
					height: 150rpx;
					margin: 38rpx 0 0 30rpx;
					position: relative;

					.image_3 {
						width: 260rpx;
						height: 148rpx;
					}

					.tag_1 {
						background-color: rgba(51, 67, 93, 1);
						height: 38rpx;
						width: 112rpx;
						position: absolute;

						.text_1 {
							width: 92rpx;
							height: 23rpx;
							overflow-wrap: break-word;
							color: rgba(255, 255, 255, 1);
							font-size: 24rpx;
							font-family: PingFang-SC-Medium;
							font-weight: 500;
							text-align: left;
							white-space: nowrap;
							line-height: 24rpx;
							margin: 7rpx 0 0 10rpx;
						}
					}

					.section_4 {
						width: 279rpx;
						height: 150rpx;
						margin-left: 19rpx;


						.text_6 {
							width: 147rpx;
							height: 29rpx;
							overflow-wrap: break-word;
							color: rgba(51, 51, 51, 1);
							font-size: 30rpx;
							font-family: PingFang-SC-Medium;
							font-weight: 500;
							text-align: left;
							white-space: nowrap;
							line-height: 30rpx;
							margin-left: 1rpx;
						}

						.tag_3 {
							background-color: rgba(47, 117, 250, 1);
							border-radius: 4px;
							// height: 36rpx;
							// width: 60rpx;
							padding: 10rpx 20rpx 13rpx 20rpx;
							margin-left: 10rpx;
							// margin: 19rpx 0 0 1rpx;


							.text_7 {
								// width: 47rpx;
								// height: 23rpx;
								overflow-wrap: break-word;
								color: rgba(255, 255, 255, 1);
								font-size: 24rpx;
								font-family: PingFang-SC-Medium;
								font-weight: 500;
								text-align: left;
								white-space: nowrap;
								line-height: 24rpx;
								// margin: 6rpx 0 0 7rpx;
							}
						}

						.text_8 {
							width: 279rpx;
							height: 25rpx;
							color: rgba(136, 136, 136, 1);
							font-size: 22rpx;
							font-family: PingFang-SC-Regular;
							text-align: left;
							line-height: 22rpx;
							margin-top: 25rpx;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}
					}

					.text_9 {
						width: 72rpx;
						height: 17rpx;
						overflow-wrap: break-word;
						color: rgba(136, 136, 136, 1);
						font-size: 22rpx;
						font-family: PingFang-SC-Regular;
						font-weight: NaN;
						text-align: left;
						white-space: nowrap;
						line-height: 22rpx;
						margin: 131rpx 0 0 59rpx;
					}
				}

				.section_5 {
					width: 689rpx;
					height: 150rpx;
					margin: 38rpx 0 902rpx 30rpx;

					.image_4 {
						width: 260rpx;
						height: 148rpx;
					}

					.box_3 {
						width: 279rpx;
						height: 150rpx;
						margin-left: 19rpx;

						.text_10 {
							width: 147rpx;
							height: 29rpx;
							overflow-wrap: break-word;
							color: rgba(51, 51, 51, 1);
							font-size: 30rpx;
							font-family: PingFang-SC-Medium;
							font-weight: 500;
							text-align: left;
							white-space: nowrap;
							line-height: 30rpx;
							margin-left: 1rpx;
						}

						.tag_4 {
							background-color: rgba(47, 117, 250, 1);
							border-radius: 4px;
							height: 36rpx;
							width: 60rpx;
							margin: 19rpx 0 0 1rpx;

							.text_11 {
								width: 47rpx;
								height: 23rpx;
								overflow-wrap: break-word;
								color: rgba(255, 255, 255, 1);
								font-size: 24rpx;
								font-family: PingFang-SC-Medium;
								font-weight: 500;
								text-align: left;
								white-space: nowrap;
								line-height: 24rpx;
								margin: 6rpx 0 0 7rpx;
							}
						}

						.text_12 {
							width: 279rpx;
							height: 21rpx;
							overflow-wrap: break-word;
							color: rgba(136, 136, 136, 1);
							font-size: 22rpx;
							font-family: PingFang-SC-Regular;
							font-weight: NaN;
							text-align: left;
							white-space: nowrap;
							line-height: 22rpx;
							margin-top: 45rpx;
						}
					}

					.text_13 {
						width: 72rpx;
						height: 17rpx;
						overflow-wrap: break-word;
						color: rgba(136, 136, 136, 1);
						font-size: 22rpx;
						font-family: PingFang-SC-Regular;
						font-weight: NaN;
						text-align: left;
						white-space: nowrap;
						line-height: 22rpx;
						margin: 131rpx 0 0 59rpx;
					}
				}
			}
		}
	}
</style>